﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Wijmo.master" AutoEventWireup="true" Inherits="C1Calendar_MultiViews" Codebehind="MultiViews.aspx.cs" %>
<%@ Register Assembly="C1.Web.Wijmo.Controls.3" Namespace="C1.Web.Wijmo.Controls.C1Calendar" TagPrefix="wijmo" %>


<asp:Content ID="Content1" ContentPlaceHolderID="Head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">

<wijmo:C1Calendar ID="C1Calendar1" runat="server" MonthRows="2" MonthCols="2">
</wijmo:C1Calendar>

</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="Description" Runat="Server">
<p>
    <strong>C1Calendar </strong>可以一次显示多个月份。
</p>

<p>
    通过设置<strong>MonthRows</strong> 和 <strong>MonthCols</strong> 属性，您可以控制每行每列显示多少个月。 
</p>

<p>
    <strong>注意</strong>: 多月份视图中不包含预览和视图功能。
</p>

</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="ControlOptions" Runat="Server">

<div class="demo-options">
	<!-- Begin options markup -->
	<div class="option-row">
		<label for="rows">行数</label>
		<select name="rows" id="rows">
			<option value="1">1</option>
			<option value="2" selected="selected">2</option>
			<option value="3">3</option>
			<option value="4">4</option>
		</select>
	</div>
	<div class="option-row">
		<label for="cols">列数</label>
		<select name="cols" id="cols">
			<option value="1">1</option>
			<option value="2" selected="selected">2</option>
			<option value="3">3</option>
			<option value="4">4</option>
		</select>
	</div>
	<!-- End options markup -->
</div>

<script type="text/javascript">
$(function () {
	

	$('#rows').bind("change keyup", function () {
	    $("#<%=C1Calendar1.ClientID %>").c1calendar({ monthRows: $(this).val() * 1 });
	});

	$('#cols').bind("change keyup", function () {
	    $("#<%=C1Calendar1.ClientID %>").c1calendar({ monthCols: $(this).val() * 1 });
	});
});
	
</script>

</asp:Content>

